{% extends 'base.html' %}
{% block title %} - New / Delete user{% endblock %}
{% block content %}
<script>
	var old_tools = new Array();
	var old_skills = new Array();
	var old_tags = new Array();

	/* Check whether the upload file is a picture. */
	function check_img(img_form){
		var location = img_form.user_video.value;
		if (location != ""){
			var point = location.lastIndexOf(".");
			var type = location.substr(point);

			if(type==".mp4"||type==".mov"||type==".swf"||type==".flv"||type==".MP4"||type==".MOV"||type==".SWF"||type==".FLV"){
				return true;
			}else{
				alert("Please chose videos in format : mov mp4 flv");
				return false;
			}
		}

		var location = img_form.user_photo.value;
		if (location != "") {
			var point = location.lastIndexOf(".");
			var type = location.substr(point);

			if(type==".jpg"||type==".gif"||type==".JPG"||type==".GIF"||type==".PNG"||type==".png"){
				return true;
			}else{
				alert("Please chose image in format : jpg png gif");
				return false;
			}
		}

		return true;
	}

	function show_array(_array, _old_array, _old_array_name, _html_id){
		var _html = '';
		for (var i=0;i<_array.length;i++){
			if (_array[2*i]){
				_html += "<input type='checkbox' value ='"+_array[2*i]+"' onmousedown=\"show_skt("
				+ _array[i*2]+",'" + _array[i*2+1] + "', "+_old_array_name+");\"";
				for (var j = 0;j<_old_array.length; j++){
					if (_old_array[j] == _array[i*2])
					_html += " checked='true' ";
				}
				_html += ">" + _array[i*2+1] + "<br/>";
			}
		}
		document.getElementById(_html_id).innerHTML = _html;
	}

	/*Show all the skills, tools and tags grouped by categories.*/
	function show_skill_tool_tag(tools, skills, tags){
		show_array(tools, old_tools, 'old_tools', '_tools');
		show_array(skills, old_skills, 'old_skills','_skills');
		show_array(tags, old_tags, 'old_tags','_tags');
	}

	function show_skt(_id, _name, _array){
		for(i=0;i<_array.length;i++){
			if (_id==_array[i]){
				_remove(_id,_array);
				_final_s_t_t();

				return ;
			}
		}

		_array.push(_id);
		_final_s_t_t();
	}

	/*Process with unselect skills, tools, tags.*/
	function _remove(_id, _array){
		for (i=0;i<_array.length;i++){
			if (_array[i]==_id){
				_array[i] = _array[_array.length - 1];
				_array.pop();
			}
		}

	}

	function push(_array, val){
		for (var i=0;i<_array.length;i++){
			if (_array[i]==val)
			return;
		}

		_array.push(val);
	}

	function check_all( tools, skills, tags){
		for (var i=0;i<skills.length/2;i++){
			push(old_skills, skills[i*2]);
		}

		for (var i=0;i<tools.length/2;i++){
			push(old_tools, tools[i*2]);
		}

		for (var i=0;i<tags.length/2;i++){
			push(old_tags, tags[i*2]);
		}

		// All check.
		show_skill_tool_tag(tools, skills, tags);
		_final_s_t_t();
	}

	function uncheck_all(tools, skills, tags){
		for (var i=0;i<skills.length/2;i++){
			_remove(skills[i*2], old_skills);
		}

		for (var i=0;i<tools.length/2;i++){
			_remove(tools[i*2], old_tools);
		}

		for (var i=0;i<tags.length/2;i++){
			_remove(tags[i*2], old_tags);
		}

		// All uncheck.
		show_skill_tool_tag(tools, skills, tags);
		_final_s_t_t();
	}

	/* Generate the final input skills, tools, tags. */
	function _final_s_t_t(){
		var tag_html = "";
		var tool_html = "";
		var skill_html = "";
		for(var i=0;i<old_tools.length;i++){
			tool_html += "<input checked='true' type='checkbox' name='final_tool' value='" + old_tools[i] +"'>";
		}

		for(var i=0;i<old_skills.length;i++){
			skill_html += "<input checked='true' type='checkbox' name='final_skill' value='" + old_skills[i] +"'>";
		}

		for(var i=0;i<old_tags.length;i++){
			tag_html += "<input checked='true' type='checkbox' name='final_tag' value='" + old_tags[i] +"'>";
		}

		document.getElementById('_final').innerHTML = tool_html + skill_html + tag_html;
	}
</script>

<p><span style="font-size:14px">Delete User</span></p>
<form method="post" action="/user/delete/">
	<table>
		{% for field in form_delete %}
		<td>User:</td>
		<td>{{field}}</td>
		<td>
			<a onclick="return confirm('Delete this user?');">
				<input type="submit" value="Delete" />
			</a>
		</td>
		{% endfor %}
	</table>
</form>
<p>
	
</p>
{% endblock %}